<template>
  <div class="bg-[#fff] rounded-lg px-[15px] container">
    <!-- <a class="h-[45px] flex justify-between items-center text-[#333] text-sm border-solid border-b border-[#e9e9e9]" href="#/main/update"></a> -->
    <!-- <a class="h-[45px] flex justify-between items-center text-[#333] text-sm border-solid border-b border-[#e9e9e9]" @click="handleUpdateData">
      <div class="flex items-center">
        <van-icon name="edit" class="text-[#2e7cff] mr-2" />
        <span>修改资料</span>
      </div>
      <van-icon name="arrow" />
    </a> -->
    <!-- <div class="h-[45px] w-full flex justify-between items-center text-[#333] text-sm border-solid border-b border-[#e9e9e9]" @click="handleUpdateData">
      <div class="flex items-center">
        <van-icon name="phone-o" class="text-[#2e7cff] mr-2" />
        <span>更换手机号</span>
      </div>
      <van-icon name="arrow" />
    </div> -->
    <div class="h-[45px] flex justify-between items-center text-[#333] text-sm border-solid border-b border-[#e9e9e9] px-2.5">
      <div class="flex items-center">
        <van-icon name="link-o" class="text-[#2e7cff] mr-2" />
        <span>第三方账号绑定</span>
      </div>
      <span>{{is_bind_wechat? '已绑定': '未绑定'}}</span>
    </div>
    <div class="h-[45px] flex justify-center items-center text-[#333] text-sm" @click="handleLogout">
      <span>退出登录</span>
    </div>
  </div>
  <Logout />
</template>

<script lang="ts">
import { computed, defineComponent } from 'vue'
import { useUserStore } from '@/store/user'
import Logout from '@/components/dialog/Logout.vue'
import { Toast } from 'vant'

export default defineComponent({
  components: { Logout },
  name: 'Confirmation',
  props: {
    userInfo: {
      type: Object,
      default: () => {}
    },
  },
  setup(props) {
    const store = useUserStore()
    const handleLogout = () => {
      store.setShowLogoutDialog(true)
    }

    const is_bind_wechat = computed(() => props.userInfo.is_bind_wechat)

    const handleUpdateData = () => {
      Toast('开发中，敬请期待～')
    }

    return {
      handleLogout,
      is_bind_wechat,
      handleUpdateData
    }
  }
})
</script>
<style lang="scss" scoped>
.container {
  box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.15)
}
</style>
